import React, { useState, useEffect } from 'react';
import './css/Dashborad.css';
import DeviceCard from './DriverCard';

// Dashboard 组件
const Dashboard = () => {
    // 设备列表
    const devices = [
        { topic: 'temperature', nick: '温度', unit: '°C', data: { value: 100, time: Date.now() } },
        { topic: 'humidity', nick: '湿度', unit: '%', data: { value: 100, time: Date.now() } },
        { topic: 'air', nick: '空气质量', unit: '', data: { value: null, time: Date.now() } },
        { topic: 'led', nick: '灯泡', unit: '', data: { value: null, time: Date.now() } },
        { topic: 'relay', nick: '继电器', unit: '', data: { value: null, time: Date.now() } },
    ];

    return (
        <div className='Dashboard'>
            {devices.map(device => (
                <DeviceCard key={device.topic} device={device} />
            ))}
      </div>
    );
};

export default Dashboard;